<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>系统登录</title>
    <link rel="icon" th:href="@{/images/favicon.ico}" type="image/x-icon"/>
  <link rel="stylesheet" th:href="@{css/login.css}">
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script th:src="@{./lib/layui/layui.js}" charset="utf-8"></script>
</head>
<style>
    .b3{
        height: 45px;
        line-height: 45px;
        margin-bottom: 20px;
        display: flex;
    }
    .b3 .b31{
        flex: 1;
        padding: 0 2px;
    }
    .x-red{
        color: red;
    }
</style>
<body class="login-bg">

    <div class="login">
        <div class="message">系统登录</div>
        <div id="darkbannerwrap"></div>   
        <form th:action="@{/login}" method="post" class="layui-form" id="myfrom">
<!--            用户登录时的名字-->
            <input name="loginName" placeholder="用户名"  type="text" lay-verify="required" class="layui-input" >
            <hr class="hr15">
            <input name="password" lay-verify="required" placeholder="密码"  type="password" class="layui-input">
            <hr class="hr15">
            <span class="x-red" id="formwarn"></span>
            <hr class="hr15">

            <input value="登录" lay-submit lay-filter="login" style="width:100%;" type="button">
            <hr class="hr20" >
        </form>
        <a th:href="@{/phoneLogin}">忘记密码?</a>
    </div>
    <script>

        $(function () {
            $("#myfrom").click(function () {
                var loginName = $("input[name='loginName']").val();
                var password = $("input[name='password']").val();
                if (loginName == "") {
                    $("#formwarn").text("用户名不能为空");
                    return false;
                }
                if (password == "") {
                    $("#formwarn").text("密码不能为空");
                    return false;
                }
                $.ajax({
                    type: "POST",
                    url: "/loginUser",
                    data: {loginName:loginName,password:password},
                    async: false,
                    error: function (request) {
                        $("#formwarn").text("出错啦....");
                        return false;
                    },
                    success: function (result) {
                        //接收后台返回的结果
                        if (result.data == 1) {
                            $("#formwarn").text(result.msg);
                            return false
                        } else {
                            window.location.href = "/index"
                        }
                    }
                })
            })
        })
        </script>

    

    
</body>
</html>